<template>
  <el-dialog v-model="openBoole" :close-on-click-modal="false" custom-class="mydialog" width="50%" :title="title"
             @close="close">
    <el-form ref="openRef" :model="openForm" :rules="rules" label-width="110px" size="small">
      <el-row>

        <el-col :span="12">
          <el-form-item label="负责营销职员" prop="headId">
            <el-select v-model="openForm.headId" style="width: 100%" placeholder="请选择营销职员" @change="handlChangeHead">
              <el-option v-for="item in headList" :key="item.id" :label="item.realName" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="关联营销任务">
            <el-input
                    ref="refInput"
                    v-model="openForm.saleTaskNo"
                    placeholder="请输入营销任务"
                    clearable
                    @clear="taskClear"
                    @blur="taskBlur"
                    @focus="taskFocus"
            />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="终端名称" prop="terminalName">
            <el-autocomplete v-model="openForm.terminalName" style="width: 100%" placeholder="请输入终端名称" @blur="terminalBlur"
                             :fetch-suggestions="querySearchTerminal" :loading="false" @select="handleSelecTerminal">
              <template #default="{ item }">
                <div class="distributeName">{{ item.terminalName }}</div>
              </template>
            </el-autocomplete>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="未找到终端" v-if="isNot">
            <el-button type="text" @click="handlTo">新建终端</el-button>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="所在地区" prop="region">
            <el-cascader v-model="openForm.region" :popper-append-to-body="false" disabled style="width: 100%"
                         placeholder="请选择地区" :options="cityList" :props="{ value: 'regionCode', label: 'regionName' }"
                         @change="handlCity" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="终端类型" prop="terminalType">
            <el-select v-model="openForm.terminalType" style="width: 100%" placeholder="请选择终端类型" disabled>
              <el-option v-for="item in terminalData.filter((a) => a.value !== 'all')" :key="item.id"
                         :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="产品名称" prop="productName">
            <product-popover-id
                    :searchs="openForm.productPopularName"
                    :terminal-id="openForm.terminalId"
                    :type-num="2"
                    @confirm="productConfirm" :disabled='disabled || openForm.allocationAgentId > 0'>
              <el-input v-model="openForm.productPopularName" placeholder="请输入产品名称" :disabled="booleDis || openForm.allocationAgentId > 0"
                        @input="onInput"/>
            </product-popover-id>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item>
            <span style="color: red">{{ openForm.errMapData }}</span>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="商品名" prop="productPopularName">
            <el-input v-model="openForm.productName" disabled />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="包装规格" prop="packSpecs">
            <el-input v-model="openForm.packSpecs" disabled />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="生产厂家" prop="packSpecs">
            <el-input v-model="openForm.producer" disabled />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="终端价" prop="terminalPrice">
            <div style="display: flex; justify-content: space-between">
              <div style="width: 80%">
                <app-price-popover ref="pricePop" :props-product="propsProduct" @confirm="priceConfirm"
                                   :disabled='disabled'>
                  <el-select v-model="openForm.terminalPrice" placeholder="请选择终端价"
                             :disabled="openForm.plaNname !== '' || booleDis" style="width: 100%" @focus="priceFocus"
                             @clear="priceClear">
                    <template #empty />
                  </el-select>
                </app-price-popover>
              </div>
              <div style=" text-align: center">
                元
                <span v-if="openForm.sellUnit">
                  /{{ getLabel("sell_unit", openForm.sellUnit) }}</span>
              </div>
            </div>
          </el-form-item>
        </el-col>

        <el-col :span="12" class="big">
          <el-form-item label="交易价" prop="tradePrice">
            <el-input v-model="openForm.tradePrice" clearable placeholder="请输入交易价" @change="handlPrice">
              <template #append>
                <span>元/{{ getLabel("sell_unit", openForm.sellUnit) }}</span>
              </template>
            </el-input>
          </el-form-item>
          <div class="box" v-if="boolePrice">
            输入的交易价低于该地区产品底价
          </div>
        </el-col>

        <!-- <el-col :span="12">
          <el-form-item label="开发期限截至" prop="expireTime">
            <date-picker v-model:date="openForm.expireTime" style="width: 100%" :disabled-date="disabledDate"
              :disabled="openForm.plaNname !== '' || booleDis" type="date" placeholder="选择日期" />
          </el-form-item>
        </el-col> -->
      </el-row>
    </el-form>

    <template #footer>
      <div class="dialog-footer" style="display: flex; justify-content: center; align-items: center">
        <el-button class="border-btn" size="small" style="margin-right: 20px" @click="close">取消
        </el-button>
        <el-button class="main-btn" size="small" type="primary" @click="handlSubmit">提交审核
        </el-button>
      </div>
    </template>
  </el-dialog>

  <rule-form ref="ruleFormDialog" form-type="2" :sub="{boole: false,title: '保存',msg:'保存成功'}" />

  <chanceTaskDialog ref="chanceTask" :head-id="openForm.headId" task-type="3" @confirm="taskConfirm"/>

</template>

<script>
  import {defineAsyncComponent, defineComponent, getCurrentInstance, inject, onMounted, reactive, toRefs,} from "vue";
  import area from "@/utils/area";
  import {validateVENum, validateVENumber} from "@/utils/validate";
  import {crmStore} from "@CRM/store";

  export default defineComponent({
    name: "DirectSellingFrom",
    emits:['succsessReg'],
    components:{
      ruleForm:defineAsyncComponent(
              () => import('../customer/terminal/modules/ruleForm.vue')
      ),
      chanceTaskDialog:defineAsyncComponent(
              () => import('./chanceTaskDialog.vue')
      )
    },
    setup(props, context) {
      const validateNum = (rule, value, callback) => {
        if (value === "" || value === null) {
          callback(new Error("请选择终端价"));
        } else {
          if (validateVENumber(value)) {
            callback(new Error("格式不正确(最多保留两位小数)"));
          } else {
            callback();
          }
        }
      };
      const validateNum1 = (rule, value, callback) => {
        if (value === "" || value === null) {
          callback(new Error("请输入交易价"));
        } else {
          if (validateVENumber(value)) {
            callback(new Error("格式不正确(最多保留两位小数)"));
          } else {
            if (value > data.openForm.terminalPrice) {
              callback(new Error("交易价不能大于终端价"));
            } else {
              callback();
            }
          }
        }
      };
      const validateVal = (rule, value, callback) => {
        if (value === "" || value === null) {
          callback();
        } else {
          if (validateVENum(value)) {
            callback(new Error("格式不正确(正整数)"));
          } else {
            callback();
          }
        }
      };
      const validateVal1 = (rule, value, callback) => {
        if (value === "" || value === null) {
          callback(new Error("请输入开发保证金"));
        } else {
          if (validateVENum(value)) {
            callback(new Error("格式不正确(正整数)"));
          } else {
            callback();
          }
        }
      };

      const userInfo = crmStore.getters['user/userInfo']
      const api = inject("api");
      const currentInstance = getCurrentInstance();
      var data = reactive({
        openForm: {
          productPopularName: "",
          terminalType: "",
          region: [],
          productId: null, // 产品Id
          productName: "", // 产品name
          approvalNumber: "", // 批准文号
          terminalPrice: "", // 终端价
          tradePrice: "", // 交易价
          packSpecs: "", // 包装规格
          accessMode: "", // 准入模式
          planId: null, // 联的招商计划id
          plaNname: "", // 联的招商计划name
          planInfoDetailId:0,
          sellMode: "direct", // 营销模式
          agentId: null, // 代理商名称
          agentName: "", // 代理商名称
          headId: null, // 负责人ID
          headName: "", // 负责人name
          devEarnestMoney: "", // 开发保证金
          minSale: null, // 最低销量
          sellUnit: "",
          minSaleUnit: "1", // 最低销量单位
          sellEarnestMoney: "", // 销量保证金
          expireTime: "", //
          productPriceId: null,
          agentProductId: null,
          provinceCode: "", // 省code
          cityCode: "", // 市code
          areaCode: "", // 区code
          ids: null,
          terminalId: null,
          errMapData: null,
          guidingPrice: "",
          allocationAgentId:0,
          saleTaskId:'',
          saleTaskNo:''
        },
        optionsList: [],
        cityList: area,
        title: "新建终端直销要素",
        openBoole: false,
        rules: {
          terminalName: [
            { required: true, message: "请选择终端", trigger: "change" },
          ],
          productPopularName: [
            { required: true, message: "请选择产品名称", trigger: "blur" },
          ],
          agentName: [{ required: true, message: "请选择名称", trigger: "blur" }],
          sellEarnestMoney: [{ validator: validateVal, trigger: "blur" }],
          devEarnestMoney: [
            { required: true, validator: validateVal1, trigger: "blur" },
          ],
          terminalPrice: [
            { required: true, validator: validateNum, trigger: "blur" },
          ],
          tradePrice: [
            { required: true, validator: validateNum1, trigger: "blur" },
          ],
          // expireTime: [
          //   { required: true, message: "请选择日期", trigger: "blur" },
          // ],
          headId: [
            { required: true, message: "请选择负责营销职员", trigger: "change" },
          ],
        },
        openRef: null,
        nuitData: crmStore.getters["dictionary/getDictionary"]["sell_num_unit"],
        salesModel: crmStore.getters["dictionary/getDictionary"]["agentType"],
        accessMode: crmStore.getters["dictionary/getDictionary"]["access_mode"],
        terminalData: crmStore.getters["dictionary/getDictionary"]["app_mode"],
        productList: [],
        id: "",
        headList: [],
        palnList: [],
        pricePop: null,
        propsProduct: {
          terminalType: "",
          productId: 0,
          region: [],
          terminalId: 0,
        },
        agentPop: null,
        booleDis: false,
        labelName: "代理商名称",
        placeholder: "请输入代理商名称",
        dialogVisible: false,
        agentAttribute: "2",
        disabled: false,
        boolePrice: false,
        isNot:false,
        ruleFormDialog:null,
        sellerTaskRef:null,
        planArea:[],
        chanceTask:null,
        refInput:null,
        taskRelationId:0,
      });

      const disabledDate = (date) => {
        // disabledDate 文档上：设置禁用状态，参数为当前日期，要求返回 Boolean
        return date.getTime() <= Date.now() - 8.64e6;
      };

      const handlTo = () => {
        data.ruleFormDialog.open(null, 1);
      };

      // 获取终端
      const querySearchTerminal = async (queryString, cb) => {
        let results = [];
        let cityCode = []
        if (data.openForm.planId && data.planArea.length){
          cityCode = [data.planArea[0].regionCode]
        }
        const res = await api.terminal.TERMINAL_DIRECT({
          selectStr: queryString,
          cityCode:cityCode,
          taskRelationId:data.taskRelationId,
        });
        if (res.code === 0) {
          results = res.data.list || [];
          if (queryString && !results.length){
            data.isNot = true
          }else {
            data.isNot = false
          }
        }else {
          currentInstance.proxy.customMessage({type:"error",message:res.msg})
          cb([])
        }
        cb(results);
      };

      const terminalBlur = () => {
        if (!data.openForm.terminalId){
          data.openForm.terminalName = ''
        }
      }

      const handleSelecTerminal = (val) => {
        if (val) {
          data.openForm.terminalName = val.terminalName;
          data.openForm.terminalId = val.id;
          data.openForm.region = [val.provinceCode, val.cityCode, val.areaCode];
          data.openForm.terminalType = val.terminalType;
          data.propsProduct.terminalType = val.terminalType;
          data.propsProduct.terminalId = data.openForm.terminalId;
          const index1 = data.cityList.findIndex(
                  (a) => a.regionCode === val.provinceCode
          );
          if (index1 !== -1) {
            const index2 = data.cityList[index1].children.findIndex(
                    (b) => b.regionCode === val.cityCode
            );
            if (index2 !== -1) {
              const index3 = data.cityList[index1].children[
                      index2
                      ].children.findIndex((c) => c.regionCode === val.areaCode);
              if (index3 !== -1) {
                data.propsProduct.region = [
                  data.cityList[index1].children[index2].children[index3],
                ];
              }
            }
          }
        } else {
          data.openForm.terminalName = "";
          data.openForm.terminalId = 0;
        }

        if (data.openForm.productId && data.openForm.terminalId) {
          const a = {
            productId: data.openForm.productId,
            terminalId: data.openForm.terminalId,
          };
          handlTermianlProduct(a);
        }
      };

      // 地区事件
      const handlCity = (val) => {
        if (val) {
          data.openForm.provinceCode = val[0];
          data.openForm.cityCode = val[1];
          data.openForm.areaCode = val[2];
        }
      };

      // 获取产品名称列表
      const querySearchAsyncProduct = async (queryString, cb) => {
        const a = {
          id: data.openForm.terminalId,
          keyWord: queryString,
        };
        let results = [];
        const res = await api.terminal.REGISTERED_TERMINAL_PRODUCT(a);
        if (res.code === 0) {
          results = res.data.list || [];
        }
        cb(results);
      };

      // 产品名称事件
      const handleSelectProduct = (val) => {
        data.openForm.productId = val.id;
        data.openForm.productName = val.productName;
        data.openForm.approvalNumber = val.approvalNumber;
        data.openForm.packSpecs = val.packSpecs;
        data.propsProduct.productId = val.id;
        data.openForm.productPopularName = val.productPopularName;
      };

      const productConfirm = (val) => {
        data.openForm.productId = val.id;
        data.openForm.productName = val.productName;
        data.openForm.productPopularName = val.productPopularName;
        data.openForm.approvalNumber = val.approvalNumber;
        data.openForm.sellUnit = val.sellUnit;
        data.openForm.packSpecs = val.packSpecs;
        data.openForm.producer = val.producer
        data.propsProduct.productId = val.id;
        data.openForm.terminalPrice = "";
        data.openForm.tradePrice = ''
        data.boolePrice = false;
        const a = {
          productId: val.id,
          terminalId: data.openForm.terminalId,
        };
        handlTermianlProduct(a);

        console.log(data.openForm.sellUnit)
      };

      const handlTermianlProduct = (val) => {
        api.terminal.TERMINAL_DIRECT_PEODUCT_ID(val).then((res) => {
          if (res.code === 0) {
            if (res?.data?.data?.errMap) {
              data.openForm.errMapData = res?.data?.data?.errMap[1];
            } else {
              data.openForm.errMapData = "";
            }
          }
        });
      };

      const onInput = () => {};

      const productClear = () => {
        data.openForm.productId = 0;
        data.openForm.productPopularName = ''
        data.openForm.productName = "";
        data.openForm.approvalNumber = "";
        data.openForm.packSpecs = "";
        data.propsProduct.productId = 0;
      };

      // 终端价
      const priceConfirm = (val) => {
        console.log(val)
        data.openForm.productPriceId = val?.id;
        data.openForm.terminalPrice = Number(val.terminalPrice);
        data.openForm.tradePrice = Number(val.terminalPrice);
        data.openForm.guidingPrice = Number(val.guidingPrice);
        data.openForm.accessMode = val.accessMode;
      };

      //交易价
      const handlPrice = (val) => {
        data.openForm.tradePrice = Number(val);
        if (data.openForm.tradePrice < data.openForm.guidingPrice) {
          data.boolePrice = true;
        } else {
          data.boolePrice = false;
        }
      };

      // 打开终端价弹框
      const priceFocus = (val) => {
        if (val) {
          data.pricePop.openPopover();
        }
      };

      // 取消终端价弹框
      const priceClear = () => {
        data.openForm.terminalPrice = "";
      };

      const sellerFocus = () => {
        data.sellerTaskRef.openPopover();
      }

      const sellerConfirm = (val) => {
        data.openForm.planId = val?.planInfo?.id;
        data.openForm.planName = val?.planInfo?.planName;
        data.openForm.planInfoDetailId = val?.planDetail?.id;


        data.openForm.productId = val?.planDetail?.productId;
        data.openForm.productName = val?.planDetail?.productName;
        data.openForm.productPopularName = val?.planDetail?.productPopularName;
        data.openForm.packSpecs = val?.planDetail?.packSpecs;
        data.openForm.producer = val?.planDetail?.producer;
        data.openForm.sellUnit = val?.planDetail?.sellUnit;

        data.openForm.productPriceId = Number(val?.planInfo?.productPriceId);
        data.openForm.terminalPrice = val?.planInfo?.terminalPrice;
        data.openForm.accessMode = val?.planInfo?.accessMode;

        data.propsProduct.productId = val?.planDetail?.productId;
        data.planArea = val?.planInfo?.region;

        if (data.openForm.productId && data.openForm.terminalId) {
          const a = {
            productId: data.openForm.productId,
            terminalId: data.openForm.terminalId,
          };
          handlTermianlProduct(a);
        }
      }

      const sellerClear = () => {
        data.openForm.planId = 0;
        data.openForm.planName = '';
        data.openForm.planInfoDetailId = 0;
        data.planArea = []
      }

      const taskConfirm = (val) => {
        data.taskRelationId = val.taskRelationId
        data.openForm.allocationAgentId = val.id;
        data.openForm.saleTaskNo = val.taskNo
        data.openForm.saleTaskId = val.saleTaskId

        data.openForm.productId = val.productId
        data.openForm.productPopularName = val.productPopularName
        data.openForm.productName = val.productName
        data.openForm.packSpecs = val.packSpecs
        data.openForm.producer = val.producer
        data.openForm.sellUnit = val.sellUnit

        if (val.relationData){
          let item = JSON.parse(val.relationData)
          console.log(item)
          data.openForm.productPriceId = Number(item?.planInfo?.productPriceId);
          data.openForm.terminalPrice = item?.planInfo?.terminalPrice;
          data.openForm.accessMode = item?.planInfo?.accessMode;

          data.propsProduct.productId = item?.planDetail?.productId;
          data.planArea = item?.planInfo?.region;
        }

        if (data.openForm.productId && data.openForm.terminalId) {
          const a = {
            productId: data.openForm.productId,
            terminalId: data.openForm.terminalId,
          };
          handlTermianlProduct(a);
        }
      }

      const taskBlur = () => {

      }

      const taskFocus = () => {
        // data.chancePop.openPopover()
        data.chanceTask.openDialog()
        data.refInput.blur()
      }

      const taskClear = () => {
        data.openForm.allocationAgentId = 0
        data.openForm.saleTaskId = ''
        data.openForm.saleTaskNo = ''
        data.taskRelationId = 0
      }

      // 获取负责人
      const handlHead = () => {
        api.terminal.HEAD_PEOPLE(1).then((res) => {
          if (res.code === 0) {
            data.headList = res.data;
          }
        });
      };

      // 负责人事件
      const handlChangeHead = (val) => {
        const index = data.headList.findIndex((a) => a.id === val);
        if (index !== -1) {
          data.openForm.headName = data.headList[index].realName;
        }
        data.openForm.planName = ''
        data.openForm.planId = 0
      };

      // 关闭弹框
      const close = () => {
        // data.sellerTaskRef.onClose();
        data.openBoole = false;
        data.dialogVisible = false;
        data.taskRelationId = 0
        remove();
      };

      // 清除弹框
      const remove = () => {
        data.planArea = []
        data.disabled = true;
        data.openRef.resetFields();
        data.openForm.sellUnit = "";
        data.openForm.planId = 0;
        data.openForm.planName = '';
        data.openForm.planInfoDetailId = 0;
        data.openForm.producer = "";
        data.openForm.errMapData = null
        data.openForm.allocationAgentId = 0
        data.openForm.saleTaskNo = ''
        data.openForm.saleTaskId = ''
        data.agentAttribute = "2";
        data.booleDis = false;
        data.labelName = "代理商名称";
        data.placeholder = "请输入代理商名称";
        data.dialogVisible = false;

        // handlClear()
        data.boolePrice = false;
        setTimeout(() => {
          data.openRef.clearValidate();
          data.disabled = false;
        },500)
      };

      const handlClear = () => {
        data.openForm = {
          region: [],
          productId: null, // 产品Id
          productName: "", // 产品name
          approvalNumber: "", // 批准文号
          terminalPrice: "", // 终端价
          tradePrice: "", // 交易价
          packSpecs: "", // 包装规格
          accessMode: "", // 准入模式
          planId: null, // 联的招商计划id
          plaNname: "", // 联的招商计划name
          sellMode: "direct", // 营销模式
          agentId: null, // 代理商名称
          agentName: "", // 代理商名称
          headId: null, // 负责人ID
          headName: "", // 负责人name
          devEarnestMoney: "", // 开发保证金
          minSale: null, // 最低销量
          sellUnit: "",
          minSaleUnit: "1", // 最低销量单位
          sellEarnestMoney: "", // 销量保证金
          expireTime: "", //
          productPriceId: null,
          agentProductId: null,
          provinceCode: "", // 省code
          cityCode: "", // 市code
          areaCode: "", // 区code
          ids: null,
          terminalId: null,
          guidingPrice: "",
        };
        data.boolePrice = false;
      };

      // 打开弹框
      const open = (val, value, num) => {
        // handlClear();
        data.disabled = false;
        data.agentAttribute = "2";
        data.dialogVisible = true;
        data.openForm.headId = userInfo.ID
        data.openForm.headName = userInfo.realName
        if (value) {
          for (const key in data.openForm) {
            data.openForm[key] = value[key];
          }
          if (data.openForm.sellMode === "direct") {
            data.openForm.agentName = value?.agentDetail?.userName;
          }
        }
        if (val) {
          data.openForm.terminalId = val.objectId;
          data.openForm.terminalName = val.objectName
          data.openForm.terminalType = val.terminalType
          data.openForm.region = [val.provinceCode, val.cityCode, val.areaCode];

          data.openForm.productId = val.productId;
          data.openForm.productName = val.productName;
          data.openForm.productPopularName = val.productPopularName;
          data.openForm.approvalNumber = val.approvalNumber;
          data.openForm.sellUnit = val.sellUnit;
          data.openForm.packSpecs = val.packSpecs;
          data.openForm.producer = val.producer
          data.propsProduct.productId = val.productId;
          data.openForm.terminalPrice = "";
          const a = {
            productId: val.productId,
            terminalId: data.openForm.terminalId,
          };
          handlTermianlProduct(a);

          data.propsProduct.terminalId = val.objectId;
          data.propsProduct.terminalType = val.terminalType;
          const index1 = data.cityList.findIndex(
                  (a) => a.regionCode === val.provinceCode
          );
          if (index1 !== -1) {
            const index2 = data.cityList[index1].children.findIndex(
                    (b) => b.regionCode === val.cityCode
            );
            if (index2 !== -1) {
              const index3 = data.cityList[index1].children[
                      index2
                      ].children.findIndex((c) => c.regionCode === val.areaCode);
              if (index3 !== -1) {
                data.propsProduct.region = [
                  data.cityList[index1].children[index2].children[index3],
                ];
              }
            }
          }
        }
        if (num === 1) {
          data.booleDis = true;
          // 产品信息
          data.openForm.productName = val.productPopularName;
          data.openForm.approvalNumber = val.approvalNumber;
          data.openForm.packSpecs = val.packSpecs;
          data.openForm.productId = val.productId;
          data.propsProduct.productId = val.productId;
          data.openForm.terminalPrice = Number(val.terminalPrice);
          data.openForm.accessMode = val.accessMode;
          data.openForm.terminalId = val.terminalId;

          console.log(val, ":--------rewrwerwer-------");
        }
        data.openBoole = true;
      };

      // 提交表单
      const handlSubmit = () => {
        data.openRef.validate((valid) => {
          if (valid) {
            let formList = {};
            if (data.openForm.ids !== null) {
              formList = {
                saleTaskNo:data.openForm.saleTaskNo,
                saleTaskId:Number(data.openForm.saleTaskId) || 0,
                allocationAgentId:Number(data.openForm.allocationAgentId) || 0,
                agentProductId: Number(data.openForm.agentProductId) || 0,
                headName: data.openForm.headName || "", // string
                headId: Number(data.openForm.headId) || 0, //	number负责人id
                planId: Number(data.openForm.planId) || 0, //
                planName: Number(data.openForm.planName) || 0, //
                planInfoDetailId: Number(data.openForm.planInfoDetailId) || 0, //
                terminals: [
                  {
                    id: Number(data.openForm.ids),
                    expireTime: data.openForm.expireTime || null,
                    devEarnestMoney: Number(data.openForm.devEarnestMoney) || 0,
                    sellEarnestMoney: Number(data.openForm.sellEarnestMoney) || 0,
                    minSale: Number(data.openForm.minSale) || 0, // 必须
                    minSaleUnit: data.openForm.minSaleUnit || "", // string
                    terminalId: Number(data.openForm.terminalId),
                    terminalName: data.openForm.terminalName,
                    terminalPrice: Number(data.openForm.terminalPrice),
                    productPriceId: Number(data.openForm.productPriceId),
                    sellMode: data.openForm.sellMode,
                    productId: data.openForm.productId,
                    tradePrice: Number(data.openForm.tradePrice),
                  },
                ],
              };
            } else {
              formList = {
                allocationAgentId:Number(data.openForm.allocationAgentId) || 0,
                agentProductId: Number(data.openForm.agentProductId) || 0,
                headName: data.openForm.headName || "", // string
                headId: Number(data.openForm.headId) || 0, //	number负责人id
                planId: Number(data.openForm.planId) || 0, //
                planName: Number(data.openForm.planName) || 0, //
                planInfoDetailId: Number(data.openForm.planInfoDetailId) || 0, //
                terminals: [
                  {
                    expireTime: data.openForm.expireTime || null,
                    devEarnestMoney: Number(data.openForm.devEarnestMoney) || 0,
                    sellEarnestMoney: Number(data.openForm.sellEarnestMoney) || 0,
                    minSale: Number(data.openForm.minSale) || 0, // 必须
                    minSaleUnit: data.openForm.minSaleUnit || "", // string
                    terminalId: Number(data.openForm.terminalId),
                    terminalName: data.openForm.terminalName,
                    terminalPrice: Number(data.openForm.terminalPrice),
                    productPriceId: Number(data.openForm.productPriceId),
                    sellMode: data.openForm.sellMode,
                    productId: data.openForm.productId,
                    tradePrice: Number(data.openForm.tradePrice),
                  },
                ],
              };
            }
            handlsubForm(formList);
          }
        });
      };

      const handlsubForm = (data) => {
        api.terminal.REGISTERED_TERMINAL_SUBMIT(data).then((res) => {
          if (res.code === 0) {
            currentInstance.proxy.customMessage({
              type: "success",
              message: "提交成功",
            });
            context.emit("succsessReg");
            close();
          } else {
            currentInstance.proxy.customMessage({
              type: "error",
              message: res.msg,
            });
          }
        });
      };

      onMounted((_) => {
        handlHead();
      });

      return {
        ...toRefs(data),
        querySearchAsyncProduct,
        handleSelectProduct,
        handlHead,
        handlChangeHead,
        close,
        remove,
        open,
        handlSubmit,
        handlCity,
        handlsubForm,
        priceConfirm,
        priceFocus,
        priceClear,
        productConfirm,
        onInput,
        productClear,
        disabledDate,
        handlClear,
        querySearchTerminal,
        handleSelecTerminal,
        handlTermianlProduct,
        handlTo,
        handlPrice,
        sellerFocus,
        sellerClear,
        sellerConfirm,
        taskBlur,
        taskFocus,
        taskClear,
        taskConfirm,
        terminalBlur,
      };
    },
  })
</script>

<style scoped lang="scss">
  .col_title {
    height: 36px;
    width: 100%;
    line-height: 36px;
    background: rgb(248, 248, 248);
    padding-left: 10px;
    box-sizing: border-box;
  }

  :deep(.el-input__inner) {
    background-color: #fff;
  }
  .big {
    position: relative;
    .box {
      position: absolute;
      font-size: 12px;
      line-height: 14px;
      color: red;
      top: 34px;
      left: 132px;
    }
  }
</style>
